<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item
      title="参数与参数之间请用‘&’连接"
      :label="$t('imageContentSeniorAdd_Imagelabel')"
      prop="imageData"
      :rules="[
        { required: true, message: '标签参数不能为空'}
      ]"
      >
        <el-input v-model.trim="form.imageData" :placeholder="$t('imageContentSeniorAdd_forexample')"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button style="background: #067FB5; color: #fff;" size="small" @click="onSubmit">{{ $t('imageContentSeniorAdd_Submit') }}</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import http from '@/utils/http'
export default {
  data () {
    return {
      form: {
        imageData: ''
      }
    }
  },
  props: ['imageId'],
  methods: {
    onSubmit () {
      // 判断参数
      if (this.form.imageData === '') {
        return this.$message({
          showClose: true,
          message: '镜像为空',
          type: 'error'
        })
      }
      // ajax请求
      const docker = `curl --unix-socket /var/run/docker.sock -s -X POST "http:/v1.40/images/${this.imageId}/tag?${this.form.imageData}"` // 标记镜像
      http({
        url: '/docker',
        method: 'POST',
        timeout: 600000000,
        data: { docker }
      }).then(res => {
        if (res.Code !== 200) {
          return this.$message({
            showClose: true,
            message: '标签添加失败！',
            type: 'error'
          })
        }
        this.$message({
          showClose: true,
          message: '标签添加成功！',
          type: 'success'
        })
        this.$emit('success')
        this.form.imageData = ''
      })
    }
  }
}
</script>
